<!doctype html>
<html lang="zh-CN">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="哈哈大王">
  <meta name="Keywords" content="潭州课堂">
  <meta name="Description" content="潭州课堂导航栏">
  <title>潭州课堂-上网学习</title>
	 <link rel="icon" href="../static/image/akl.ico" type="image/x-icon/">
	 <style>
	 	 *{
		 margin:0px;
		 padding:0px;
		 list-style:none;
		 }
		 .box1{
		 position:relative;
		 width:100%;
		 height:390px;
		 top:50px;
		 font-family:"微软雅黑";
		 /* background-color:pink; */

		 }
		 .head1{
		 position:absolute;
		 left:75px;
		 width:1100px;
		 height:65px;
		 font-size:20px;
		 background:url(../static/image/1.png) no-repeat 25px 25px,linear-gradient(to right,blue 0%,snow 210px) no-repeat,url(../static/image/7.png) no-repeat 870px 10px;
		 background-size:18px 15px,210px 65px,177px 49px;
		 }
		 .head1~li{
		  position:absolute;
		  width:210px;
		 height:65px;
		 background-color:#778899;
		 font-size:20px;
		 line-height:65px;
		 text-align:center;
		 color:white;
		 }
		 .head2{
		 left:75px;
		  top:65px;
		  background:url(../static/image/2.png) no-repeat 25px 25px;
		  background-size:18px 15px;
		 }
		 .head3{
		  left:75px;
		  top:130px;
		  background:url(../static/image/3.png) no-repeat 25px 25px;
		  background-size:18px 15px;
		 }
		 .head4{
		 left:75px;
		  top:195px;
		  background:url(../static/image/4.png) no-repeat 25px 25px;
		  background-size:18px 15px;
		 }
		 .head5{
		 left:75px;
		  top:260px;
		  background:url(../static/image/5.png) no-repeat 25px 25px;
		  background-size:18px 15px;
		 }
		 .head6{
		 left:75px;
		  top:325px;
		  background:url(../static/image/6.png) no-repeat 25px 25px;
		  background-size:18px 15px;
		 }
		  .tex1~span{
		 margin-left:50px;
		 }
		 .tex1{
		 margin-left:64px;
		 margin-right:75px;
		 line-height:65px;
		 color:white;
		 }
		 .tex1~span:hover{
		 color:#58a;
		 }
		.head2:hover{
		 background-color:#DCDCDC;
		 }.head3:hover{
		 background-color:#DCDCDC;
		 }.head4:hover{
		 background-color:#DCDCDC;
		 }.head5:hover{
		 background-color:#DCDCDC;
		 }.head6:hover{
		 background-color:#DCDCDC;
		 }
		 
		 .head1~li>div{
		  display:none;  
		 position:absolute;
		  width:400px;
		 height:300px;
		 border:2px solid pink; 
		 background-color:snow;
		 color:black;
		 } 
		 .head2:hover .head2son{
		  	display:block;
		   } 
		   .head3:hover .head3son{
		  	display:block;
		   } 
		   .head4:hover .head4son{
		  	display:block;
		   } 
		   .head5:hover .head5son{
		  	display:block;
		   } 
		   .head6:hover .head6son{
		  	display:block;
		   }
		   .head2son{
		   left:210px;
		   top:0px;
		   font-size:15px;
		   font-family:"仿宋";
		   }
		    .head2son:hover{
			color:hotpink;
			}
			 .head3son{
		   left:210px;
		   top:-65px;
		   font-size:15px;
		   font-family:"仿宋";
		   }
		    .head3son:hover{
			color:hotpink;
			} 
			.head4son{
		   left:210px;
		   top:-130px;
		   font-size:15px;
		   font-family:"仿宋";
		   }
		    .head4son:hover{
			color:hotpink;
			} 
			.head5son{
		   left:210px;
		   top:-195px;
		   font-size:15px;
		   font-family:"仿宋";
		   }
		    .head5son:hover{
			color:hotpink;
			}
			.head6son{
		   left:210px;
		   top:-260px;
		   font-size:15px;
		   font-family:"仿宋";
		   }
		    .head6son:hover{
			color:hotpink;
			}
			.urlone{
			 display:block;
			 width:210px;
		     height:65px;
			 text-decoration: none;
			 color:snow;
			}
			.urltwo{
			 display:block;
			 width:100%;
		     height:auto;
			 text-decoration: none;
			/*  color:pink; */
			}
		  
	 </style>
 </head>
 <body>
  <div class="box1">
  	 <ul class="navigationbar">
		 <li class="head1"> 
			<span class="tex1">课程分类</span><span>首页</span><span>全部课程</span><span>客户端</span><span>关于我们</span><span>商户入驻</span>
		 </li>
		 <li class="head2">
			 <span class="navigationbarpic"><a  class="urlone" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >IT互联网</a></span>
			 	 <div class="head2son"><span><a  class="urltwo" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >CPHPPythonC++JavaLinux
					互联网运营
					淘宝运营新媒体运营SEOSEM网络营销天猫运营营销实战
					前端开发
					JavaScriptDIV
					移动开发
					a	ndroidiOS
					游戏开发
					Cocos2d-x游戏开发Unity3d游戏开发
					云计算大数据
					大数据区块链人工智能</span></a>
				 </div>
		 </li>
		 <li class="head3">
			 <span class="navigationbarpic"><a  class="urlone" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >设计创作</a></span>
				 <div class="head3son"><span><a  class="urltwo" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >2dfasdfasdwerffvxcgasdfa</a></span>
				 </div>
		 </li>
		 <li class="head4">
			 <span class="navigationbarpic"><a  class="urlone" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >实用外语</a></span>
				 <div class="head4son"><span><a  class="urltwo" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >3hsdfgaewrwdfasdfawef</a></span>
				 </div>
		 </li>
		 <li class="head5">
			 <span class="navigationbarpic"><a  class="urlone" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >兴趣艺术</a></span>
				 <div class="head5son"><span><a  class="urltwo" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >4wsfsadfefsdfsdf</a></span>
				 </div>
		 </li>
		 <li class="head6">
			 <span class="navigationbarpic"><a  class="urlone" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >农业生产</a></span>
				 <div class="head6son"><span><a  class="urltwo" href="https://www.shiguangkey.com/course/list?cateId=258" target="_blank" >5wersdfvyhrtger</a></span>
				 </div>
		 </li>
	 	 
	 </ul>
	 

  </div>
 </body>
</html>
